<template>
	<view class="detail-page" v-if="isShowContent">
		<view class="top-box">
			<view class="title">{{data_info.title}}</view>
			<view class="time">{{data_info.add_time}}</view>
		</view>
		<view class="parse">
			<block v-if="data_info.file_url">
				<button class="btn" @click="lookPdf(data_info.file_url)">查看PDF</button>
			</block>
			<block v-if="data_info.xiangqing">
				<u-parse :content="data_info.xiangqing"></u-parse>
			</block>
		</view>
	</view>
</template>

<script>
	const util = require('../../common/util.js');
	const data = require('../../common/data.js');
	export default {
		data() {
			return {
				content: '',
				zhengce_id: 0,
				data_info: [],
				isShowContent:false
			}
		},
		onLoad(opt) {
			this.zhengce_id = opt.id;
			this.loadData();
		},
		methods: {
			loadData: function() {
				let that = this;
				var requsetData = {};
				requsetData.zhengce_id = that.zhengce_id;
				util.requestPost(
					'/Index/zhengceDetail',
					requsetData,
					function(res) {
						that.data_info = res.data.data_info;
						that.isShowContent = true;
					},
					'', {
						isShowLoading: false
					}
				);
			},
			lookPdf(file_url) {
				uni.downloadFile({
					url: file_url,
					success: (res) => {
						console.log(res);
						let filePath = res.tempFilePath
						uni.openDocument({
							filePath: filePath,
							showMenu: true,
							success: (res) => {
								console.log('打开文档成功')
							},
							fail: (err) => {
								console.log('打开文档失败', err)
							}
						})
					},
					fail: (err) => {
						console.log('下载失败', err)
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.detail-page {
		padding: 0 24rpx 24rpx;

		.top-box {
			padding: 24rpx 0;
			border-bottom: 1rpx solid #eee;

			.title {
				font-size: 32rpx;
				font-weight: bold;
			}

			.time {
				margin-top: 12rpx;
				color: #666;
				font-size: 26rpx;
			}
		}

		.parse {
			margin-top: 24rpx;

			.btn {
				height: 92rpx;
				border-radius: 50rpx;
				color: #fff;
				font-size: 30rpx;
				line-height: 92rpx;
				background-color: $primary-color;
				margin-bottom: 20rpx;
			}
		}
	}
</style>